<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;">
<title>Untitled Document</title>
<script language="JavaScript">
<!--
function fnClsScroll(szClass, szRoller, szContent, iContent)
{
	this.szClass = szClass;
	this.objRoller = document.getElementById(szRoller);
	this.szContent = szContent;
	this.iContent = iContent;
	this.fnInitScroll = fnInitScroll;
	this.fnRoll = fnRoll;
	this.bRoll = true;
	this.fnMouseover = fnMouseover;

	this.iCurrent = 0;
	this.fnInitScroll();
}

function fnInitScroll()
{
	this.iCurrent++;

	if(this.iCurrent > this.iContent) this.iCurrent = 1;

	var tmpCurrent = this.iCurrent;

	this.objRoller.innerHTML = document.getElementById(this.szContent + "_" + tmpCurrent++).innerHTML;
	if(tmpCurrent > this.iContent) tmpCurrent = 1;

	this.objRoller.innerHTML += document.getElementById(this.szContent + "_" + tmpCurrent++).innerHTML;
	if(tmpCurrent > this.iContent) tmpCurrent = 1;

	this.objRoller.innerHTML += document.getElementById(this.szContent + "_" + tmpCurrent++).innerHTML;
	if(tmpCurrent > this.iContent) tmpCurrent = 1;

	setTimeout(this.szClass + ".fnRoll()", 100);
}

function fnRoll()
{
	if(this.bRoll){
		//document.getElementById("iii").innerHTML = this.objRoller.style.top;
		this.objRoller.style.top = parseInt(this.objRoller.style.top) - 1;

		if(parseInt(this.objRoller.style.top) <= -24){
			this.objRoller.style.top = 0;
			this.fnInitScroll();
			return;
		}
	}
	setTimeout(this.szClass + ".fnRoll()", 100);
}

function fnMouseover(obj)
{
	if(obj) obj.bRoll = false;
}

function fnMouseout(obj)
{
	if(obj) obj.bRoll = true;
}
//-->
</script>
</head>

<body>
<div id="iii"></div>
<table border="1" cellpadding="0" cellspcing="0">
	<tr><td width="500" align="center">
		<div style="position:relative; width:100px; height:48px; border:1px solid black; overflow:hidden;">
			<div id="idRoller" style="position:absolute; left:0px; top:0px;" onMouseover="javascript:fnMouseover(clsScroll);" onMouseout="javascript:fnMouseout(clsScroll);">

			</div>
		</div>

		<div id="idContent_1" style="display:none;">
		<table border="1" cellpadding="0" cellspacing="0">
			<tr><td width="100" height="20">1</td></tr>
		</table>
		</div>

		<div id="idContent_2" style="display:none;">
		<table border="1" cellpadding="0" cellspacing="0">
			<tr><td width="100" height="20">2</td></tr>
		</table>
		</div>

		<div id="idContent_3" style="display:none;">
		<table border="1" cellpadding="0" cellspacing="0">
			<tr><td width="100" height="20">3</td></tr>
		</table>
		</div>

		<div id="idContent_4" style="display:none;">
		<table border="1" cellpadding="0" cellspacing="0">
			<tr><td width="100" height="20">4</td></tr>
		</table>
		</div>

		<script language="JavaScript">
		<!--
			var clsScroll = new fnClsScroll("clsScroll", "idRoller", "idContent", 4);
		//-->
		</script>
	</td></tr>
</table>
</body>
</html>
